// 处理 单个 属性 对应的 css

const getAttr = function (val, attrName, call) {
  // 判断是否需要拦截  替换名称
  let realAttr = typeof call === 'function' && call(val, attrName)
  if (!realAttr.attrName) {
    return ''
  }
  attrName = realAttr.attrName
  val = realAttr.val
  if (!val || !val.constructor) {
    return ''
  } else if ((val.constructor.name === 'Array') && val.length === 0) {
    return ''
  } else if (val.constructor.name === 'Array') {
    // 数组
    return attrName + ':' + val.join(' ') + ';'
  } else {
    return attrName + ':' + val + ';'
  }
}
// 统一处理 自定义 属性的 css 样式
const getStyle = function (data, call) {
  let prop = []
  for (const key in data) {
    let value = ''
    if (data.hasOwnProperty(key)) {
      value = data[key] ? data[key].toString() : ''
    }
    // 区分数组 所有的属性 有多个
    let valueArray = (value && value.split('|')) || []
    let result = getAttr(valueArray.length > 1 ? valueArray : value, key, call)
    if (result) {
      prop.push(result)
    }
  }
  return prop.join('')
}

export default {
  getStyle,
  getAttr
}
